<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@page contentType="text/html;charset=UTF-8"
	import="com.srit.forecast.constant.Constant"%>
<%@page pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="srit-tag" uri="/srit-constant-tag"%>
<srit-tag:Constant var="PAGE_TYPE_FORM" />
<srit-tag:Constant var="PAGE_TYPE_LIST" />
<srit-tag:Constant var="PAGE_TYPE_ALL" />
<html>
<head>
<title></title>
<link href="<c:url value="/resources/css/style.css" />" rel="stylesheet"
	type="text/css">
<link href="<c:url value="/resources/css/list_css.css" />"
	rel="stylesheet" type="text/css">
<link href="<c:url value="/resources/css/autocomplete.css" />"
	rel="stylesheet" type="text/css">
<script src="<c:url value="/resources/js/jquery-1.8.0.min.js" />"></script>
</head>
<!-- 搜索 -->
<c:if test="${pageType==PAGE_TYPE_ALL}">
	<div id="SearchDiv"></div>
</c:if>

<!-- 列表页 -->
<c:if test="${pageType==PAGE_TYPE_LIST||pageType==PAGE_TYPE_ALL}">
	<div id="pageDiv">
		<div>
			<a href="<c:url  value="/codeType-form"></c:url>">创建</a>
		</div>
		<table class="sritTable listTable" align='center' id="table"
			width="98%" style="margin-top: 5px">
			<tr>
				<th><input type="checkbox" /></th>
				<th>ID</th>
				<th>NAME</th>
				<th>TYPE</th>
				<th>ENABLED</th>
				<th>排序</th>
				<th>操作</th>
			</tr>
			<c:forEach var="bean" items="${page.list}">
				<tr onMouseOver="javascript:this.style.backgroundColor='#AABBFF';"
					onMouseOut="javascript:this.style.backgroundColor='#FFFFFF';"
					ondblclick="javascript:window.location='<c:url  value="/codeType-edit">
					<c:param name="id" value="${bean.id }"/>
					</c:url>'">
					<td><input type="checkbox" value="${bean.id }" /></td>
					<td>${bean.id }</td>
					<td>${bean.name }</td>
					<td>${bean.type }</td>
					<td>${bean.enabled }</td>
					<td>${bean.orderNo}</td>
					<td></td>
				</tr>
			</c:forEach>
		</table>

		<table class="sritTable" align='center' id="table" width="98%"
			style="margin-top: 0px">
			<tr>
				<td class="td_tl">${page.count},${page.pageNum}</td>
			</tr>
		</table>
	</div>
</c:if>

<!-- 表单页 -->
<c:if test="${pageType==PAGE_TYPE_FORM||pageType==PAGE_TYPE_ALL}">
	<div id="createDiv">
		<table class="menu-pare" align='center' width="98%"
			style="text-align: right">
			<tr>
				<td><a href="<c:url  value="/codeType-search"></c:url>">返回</a></td>
			</tr>
		</table>

		<form:form modelAttribute="codeType" action="/codeType-saveOrUpdate"
			method="post" enctype="multipart/form-data">
			<form:hidden path="id" />
			<table class="sritTable" align='center' id="table" width="98%">
				<tr>
					<th colspan="4">代码类别</th>
				</tr>
				<tr>
					<td class="td_tl">名称</td>
					<td><form:input path="name" /></td>
					<td class="td_tl">类型</td>
					<td><form:input path="type" /></td>
				</tr>
				<tr>
					<td class="td_tl">排序</td>
					<td><form:input path="orderNo" /></td>
					<td class="td_tl">启用</td>
					<td><label><form:radiobutton path="enabled" value="Y" />是</label>
						<label><form:radiobutton path="enabled" value="N" />否</label></td>
				</tr>
				<tr>
					<td colspan="4" class="td_tl"><c:if
							test="${codeType.id==null}">
							<input type="submit" value="保存" />
						</c:if> <c:if test="${codeType.id!=null }">
							<input type="submit" value="修改" />
						</c:if> <input type="reset" /></td>
				</tr>
			</table>
		</form:form>
		<br />
		<table class="menu-son-form" align='center' width="98%"
			style="text-align: right">
			<tr>
				<td><a href="javascript:addCode()">新增</a></td>
			</tr>
		</table>
		<table class="sritTable listTable" align='center' width="98%"
			id="table-son-list">
			<tr>
				<th width="10%">ID</th>
				<th width="20%">名称</th>
				<th width="20%">代码</th>
				<th width="20%">启用</th>
				<th width="30%">图片</th>
			</tr>
			<c:forEach var="bean" items="${codeType.codeList}">
				<tr onMouseOver="javascript:this.style.backgroundColor='#AABBFF';"
					onMouseOut="javascript:this.style.backgroundColor='#FFFFFF';"
					ondblclick="javascript:modifyCode(${bean.id},this)">
					<td>${bean.id }</td>
					<td>${bean.name }</td>
					<td>${bean.code }</td>
					<td>${bean.enabled}</td>
					<td>${bean.image } <img alt=""
						src="<c:url value="/upload/${bean.image}"/>">
					</td>
				</tr>
			</c:forEach>
		</table>
		<br>
		<form:form modelAttribute="codeListVo"
			action="/code-saveList?codeTypeId=${codeType.id }" method="post"
			enctype="multipart/form-data">

			<table class="sritTable" align='center' width="98%"
				id="table-son-form" style="visibility: hidden;">
				<tr class="tr_clone">
					<td width="10%"><input type="hidden" value="${codeType.id}" />&nbsp;</td>
					<td width="20%"><input type="text"></td>
					<td width="20%"><input type="text"></td>
					<td width="20%"><label><input type="radio" value="Y"
							checked="checked" />是</label> <label><input type="radio"
							value="N" />否</label></td>
					<td width="30%"><input type="file" /></td>
				</tr>
				<tr>
					<td colspan="5" class="td_tl"><input type="submit" value="保存" />
					</td>
				</tr>
			</table>
		</form:form>
		<script>
			function modifyCode(id, rowObj) {
				//console.log(rowObj)
				$.ajax({
					type : "POST",
					url : '<c:url value="/codeById.json"></c:url>',
					data : "id=" + id,
					dataType : "json",
					success : function(json) {
						console.log("Json is " + JSON.stringify(json));
						$(rowObj).find("td").each(function(i, el) {
							switch (i) {
							case 0:
								
								break;
							case 1:
								$(el).empty();
								$(el).append($("<input type='hidden' value='"+json.id+"'>"));
								$(el).append($("<input type='text' value='"+json.name+"'>"));
								break;
							case 2:
								$(el).empty();
								$(el).append($("<input type='text' value='"+json.code+"'>"));
								break;
							case 3:
								$(el).empty();
								$(el).append($("<label><input type=\"radio\" value=\"Y\" checked=\"checked\" />是</label>"));
								$(el).append($("<label><input type=\"radio\" value=\"N\" />否</label>"));
								break;
							default:
								break;
							}
						});

					}
				});
			}
			function addCode() {
				if ($("#table-son-form").css("visibility") == "visible") {
					var $clone = $(".tr_clone:last").clone();
					//$colone.attr("class","tr_colne")
					//console.log($clone)
					$(".tr_clone:last").after($clone);
				} else {
					$("#table-son-form").css("visibility", "visible");
				}
				changeRowAttribute();
			}

			function changeRowAttribute() {
				$.each($(".tr_clone"), function(i, el) {
					//console.log(el)
					//console.log(i)
					$.each($(el).find("td"),
							function(j, elson) {
								var list = "codeList[" + i + "]"
								switch (j) {
								case 0:
									$(elson).children().attr("name",
											list + ".codeTypeId");
									break;
								case 1:
									$(elson).children().attr("name",
											list + ".name");
									break;
								case 2:
									$(elson).children().attr("name",
											list + ".code");
									break;
								case 3:
									$(elson).children().attr("name",
											list + ".enabled");
									break;
								case 4:
									console.log("4:" + $(elson).html())
									$(elson).children().attr("name",
											list + ".uploadItem");
									break;
								default:
									return

									

								}
							})
				});
			}
		</script>

	</div>
</c:if>


</html>




